<template>
  <div class="student">
      <h2>学生姓名：{{name}}</h2>
      <h2>年龄：{{age+1}}</h2>
      <button @click="sendStudentName">把学生名给APP</button><hr>
      <button @click="unbind">解绑atguigu事件</button><hr>
      <button @click="unbindAll">解绑多个自定义事件</button><br>
      <button @click="death">销毁Student实例对象</button>
  </div>
</template>

<script>
export default {
    name:'Student',
    data(){
        return {
           name:'张三',
           age:18
        }
    },
    methods:{
        sendStudentName(){
            //触发Student组件实例身上的atguigu事件
            this.$emit('atguigu',this.name)
            // this.$emit('demo')
        },
        unbind(){
            this.$off('atguigu')//解绑一个自定义事件
        },
        unbindAll(){
            //解绑多个自定义事件
            // this.$off(['atguigu','demo'])
            //解绑所有的自定义事件
            this.$off()
        },
        death(){
            
            //销毁当前Student组件的实例，销毁后所有Student实例的自定义事件都不奏效。
            this.$destroy()
        }
    }
}
</script>
<style scoped>
    .student{
        background-color: red;
    }
    
    
</style>